.help-and-feedback-index{
  background: rgb(238,240,243);
  .help-and-feedback-bg{
    height: 200px;
    line-height: 160px;
    text-align: center;
    font-size: 16px;
    color: white;
  }
  .help-and-feedback-content{
    width: 873px;
    margin: 0 auto;
    .help-and-feedback-cards{
      margin: 20px 0;
      .help-and-feedback-card{
        margin-right: 24px;
        display: inline-block;
        vertical-align: top;
      }
    }
    .player-area{
      width: calc(100% - 28px);
      margin-bottom: 20px;
    }
    .course-area{
      width: calc(100% - 28px);
      height: 90px;
      background: white;
      margin-bottom: 20px;
      .course-area-img{
        width: calc(100% - 290px);
        float: left;
        height: 90px;
      }
      .course-area-content{
        width: 135px;
        float: right;
        height: 90px;
        position: relative;
        .course-area-btn{
          position: absolute;
          top: 27px;
          height: 36px;
          width: 120px;
          border-radius: 18px;
          background-image: linear-gradient(-180deg, #76B6FF 0%, #4689FF 100%);
          box-shadow: 0 4px 10px 0 rgba(39,112,255,0.21);
          cursor: pointer;
        }
        .course-area-btn-text{
          position: absolute;
          top: 34px;
          left: 33px;
          color: white;
          z-index: 3;
          cursor: pointer;
        }
        .course-area-close{
          position: absolute;
          top: 8px;
          right: 8px;
          color: #D8D8D8;
          cursor: pointer;
        }
      }
    }
    .help-and-feedback-log{
      width: 846px;
      background: white;
      border: 1px solid #E9E9E9;
      margin-bottom: 15px;
      padding: 20px;
      .update-log-title{
        font-size: 16px;
        color: rgba(0,0,0,0.85);
        font-weight: 600;
      }
      .log-version{
        display: inline-block;
        font-weight: 600;
        font-size: 19px;
        color: black;
      }
      .log-date{
        display: inline-block;
        color: rgba(0,0,0,0.45);
        margin-left: 15px;
      }
      .log-content{
        margin-top: 10px;
        cursor: pointer;
        &:hover{
          color: $default-color;
        }
      }
      .log-link{
        color: $default-color;
        cursor: pointer;
      }
    }
    .help-and-feedback-contracts{
      width: 846px;
      background: white;
      border: 1px solid #E9E9E9;
      height: 294px;
      text-align: center;
      .help-and-feedback-help{
        height: 94px;
        line-height: 94px;
        font-size: 20px;
        color: #6A6A6A;
      }
      .help-and-feedback-contract{
        display: inline-block;
        height: 200px;
        width: 280px;
        .contract-title{
          font-size: 16px;
          color: rgba(0,0,0,0.85);
          line-height: 24px;
        }
        .contract-content{
          font-size: 14px;
          color: #262626;
          margin: 2px 0 5px 0;
        }
        .contract-time{
          height: 18px;
          font-size: 12px;
          color: rgba(0,0,0,0.45);
        }
      }
    }
  }
}
